<template>
	<view class="publish-success">
		<view class="publish-result">
			当前心愿仅需<text class="red">{{wishInfo.need_people}}</text>人支持
			<text class="iconfont icon-wenhao" @click="onWenhaoClick"></text>
		</view>
		<!-- <rich-text class="publish-title" :nodes="wishInfo.support_txt"></rich-text> -->
		<view class="publish-desc"> <heart-text :text="wishInfo.success_tips"></heart-text></view>
		<view class="publish-need">
			<view class="publish-list">
				<image class="publish-img-li" src="/static/will-avatar.png" mode="aspectFill"></image>
				<image class="publish-img-li" src="/static/will-avatar.png" mode="aspectFill" v-if="wishInfo.need_people>1"></image>
				<image class="publish-img-li" src="/static/will-avatar.png" mode="aspectFill" v-if="wishInfo.need_people>2"></image>
				<text class="publish-txt-li">...</text>
			</view>
			<image  class="publish-image" :webp="true" mode="aspectFill" :src="wishInfo.goods_img_url"></image>
		</view>
		<view class="publish-btns">
			<tool-tip class="free-tip" v-if="wishInfo.can_free_support===1"><rich-text :nodes="wishInfo.bubble_tips"></rich-text></tool-tip>
			<button class="btn-primary" type="primary" @click="showShare">{{wishInfo.share_button_txt}}</button>
			<button class="btn-normal" type="default" @click="goDetail">查看心愿详情</button>
		</view>
		<wish-detail-popup ref="detail" :isFree="wishInfo.can_free_support==1" />
		<share-popup :groupId="groupId" @init="initShareInfo" :visible.sync="sharePopupVisible"></share-popup>
		
	</view>
</template>

<script>
	import SharePopup from '@/components/share-popup.vue'
	import WishDetailPopup from '@/components/popups/wish-detail-popup.vue'
	// #ifdef MP-WEIXIN
	import ShareMixin from '@/mixins/share-mixin.js'
	// #endif
	export default {
		// #ifdef MP-WEIXIN
		mixins: [ShareMixin],
		// #endif
		components: {
			SharePopup,
			WishDetailPopup
		},
		onLoad(data){
			console.log(data)
			let wish=JSON.parse(decodeURIComponent(data.wish))
			console.log(wish)
			this.groupId=wish.group_id
			this.wishInfo=wish
		},
		data() {
			return {
				groupId:'',
				wishInfo:{
					need_people:0
				},
				sharePopupVisible: false
			};
		},
		methods:{
			goDetail(){
				uni.navigateTo({
					url:`/pages/wish/detail?group_id=${this.wishInfo.group_id}`
				})
			},
			showShare(){
				this.sharePopupVisible=true
			},
			onWxShare(from){
				console.log(from)
				if(from==='button'){
					uni.$emit('closeInvite')
				}
			},
			onWenhaoClick(){
				this.$refs.detail.open({id:this.groupId})
			}
		}
	}
</script>

<style lang="scss">
.publish-success{
	.publish-result{
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top:63rpx;
		font-size:40rpx;
		font-weight: 600;
		.icon-wenhao{
			font-size: 40rpx;
			color:#999999;
		}
	}
	.icon-correct{
		margin-right:10rpx;
		font-size:50rpx;
		font-weight: normal;
	}
	.publish-desc{
		display: flex;
		justify-content: center;
		margin-top:30rpx;
		font-size:24rpx;
		color:#E7404A;
	}
	.publish-need{
		display: flex;
		align-items: center;
		margin:50rpx 75rpx 0;
		padding:30rpx;
		background-color: #f6f6f6;
		border-radius:10rpx;
		border:1px solid #e0e0e0;
	}
	.publish-list{
		display: flex;
		flex: 1;
	}
	.publish-img-li{
		margin-left:-10rpx;
		width:90rpx;
		height:90rpx;
		border-radius: 100%;
		&:first-child{
			margin-left:0rpx;
		}
	}
	.publish-txt-li{
		margin-left:20rpx;
		font-size:48rpx;
		color:#d8d8d8;
	}
	.publish-image{
		width:140rpx;
		height:140rpx;
		border-radius: 4rpx;
	}
	.publish-btns{
		position: relative;
		margin:80rpx 75rpx 0rpx;
	}
	.free-tip{
		position: absolute;
		right: 0;
		bottom:100%;
	}
	.btn-primary{
		margin-bottom:40rpx;
		background-color: #E7404A;
		border-radius: 10rpx;
		font-size: 36rpx;
		font-weight: 600;
	}
	.btn-normal{
		background-color: #fff;
		border-radius: 10rpx;
		font-size: 36rpx;
		font-weight: 600;
		color:#999;
	}
}

</style>
